<template>
	<view>
		<view class="content">
			<view class="name">
				<view class="name-left">手机号</view>
				<view class="name-right">
					<input class="name-text" placeholder="请输入手机号" type="number" maxlength="11" v-model="phone"/>
					<view class="blank1"></view>
				</view>
			</view>
			<view class="name">
				<view class="name-left">密码</view>
				<view class="name-right">
					<input class="name-text" placeholder="请输入密码" password v-model="password"/>
					<view class="blank1"></view>
				</view>
			</view>
			
			<view class="zhuce" @click="tozhuce">注册</view>
			
			</view>
			<view :class="[phone&&password?'activeSave':'','save']" @click='submit'><span class="save-text">登录</span></view>
		</view>
	</view>
</template>

<script>
	export default{
		data(){
			return {
				password:'',
				phone:''
			}
		},
		methods:{
			tozhuce(){
				uni.navigateTo({
					url:'/pages/login/register'
				})
			},
			submit(){
				let that = this
				/* uni.switchTab({
					url:'/pages/index/index'
				})
				return */
				if(that.phone==''){
					that.$utils.showLayer('请填写手机号')
					return
				}
				if(that.password==''){
					that.$utils.showLayer('请填写密码')
					return
				}
				let paramData = {
					mobile:that.phone,
					password:that.password
				}
				 this.$utils.postrequest("/api/login", paramData, function (res) {
				    if(res.code==200){
						uni.setStorageSync('token',res.data.token)
						uni.setStorageSync('avatar',res.data.avatar)
						uni.setStorageSync('nickname',res.data.nickname)
						uni.setStorageSync('userId',res.data.id)
						uni.setStorageSync('sex',res.data.sex)
						uni.switchTab({
							url:'/pages/index/index'
						})
					}else{
					that.$utils.showLayer(res.message)
					}
				 })
			}
		}
	}
</script>

<style scoped>
	.zhuce{
		/* width:100%; */
		text-align: right !important;
		color: #007AFF !important;
		font-size: 26rpx;
		margin:30rpx 70rpx;
	}
	.top{
		width: 100%;
		height: 90rpx;
		background: black;
	}
	.content{
		margin: 230rpx 0rpx 0rpx 106rpx;
	}
	.data{
		font-size: 40rpx;
		font-family: PingFang SC;
		
		color: #2B2937;
		line-height: 27rpx;
	}
	.remark{
		width: 550rpx;
		margin-top: 46rpx;
		font-size: 23rpx;
		font-family: PingFang SC;
		
		color: #5D5D5D;
		line-height: 27rpx;
	}
	.img{
		width: 135rpx;
		height: 135rpx;
		margin: 80rpx 0rpx 0rpx 220rpx;
	}
	.img-text{
		margin: 20rpx 0rpx 0rpx 110rpx;
		
		font-size: 23rpx;
		font-family: PingFang SC;
		
		color: #5D5D5D;
		line-height: 27rpx;
	}
	.sex{
		display: flex;
		flex-wrap: wrap;
		margin-top: 35rpx;
	}
	.sex-all{
		margin-top: 30rpx;
		font-size: 28rpx;
		font-family: PingFang SC;
		
		color: #1A1A1A;
		line-height: 27rpx;
	}
	.classify{
		display: flex;
		flex-wrap: wrap;
		width: 415rpx;
		height: 82rpx;
		background: #F6F7F9;
		border-radius: 38rpx;
		margin-left: 30rpx;
	}
	.sexAll{
		display: flex;
		flex-wrap: wrap;
		margin: 25rpx 0rpx 0rpx 60rpx;
	}
	.nan{
		width: 30rpx;
		height: 30rpx;
	}
	.classify-text{
		font-size: 23rpx;
		font-family: PingFang SC;
		font-weight: bold;
		color: #C5C6CB;
		line-height: 27rpx;
		margin-left: 10rpx;
	}
	.blank{
		width: 2rpx;
		height: 60rpx;
		background: #c5C6Cb;
		margin: 10rpx 0rpx 0rpx 70rpx;
	}
	.name{
		margin-top: 60rpx;
		display: flex;
		flex-wrap: wrap;
	}
	.name-left{
		width: 100rpx;
		font-size: 28rpx;
		font-family: PingFang SC;
		
		color: #1A1A1A;
		line-height: 27rpx;
	}
	.name-right{
		margin-left:70rpx ;
	}
	.name-text{
		margin:0rpx 0rpx 25rpx 17rpx;
		font-size: 23rpx;
		font-family: PingFang SC;
		
		color: #1A1A1A;
		line-height: 27rpx;
	}
	.blank1{
		width: 397rpx;
		height: 2rpx;
		background: #EEEEEE;
	}
	.age-text{
		
		font-size: 25rpx;
		font-family: PingFang SC;
		
		color: #D1CFDD;
		line-height: 27rpx;
	}
	.activeSave{
		background-color: #6C51FF !important;
	}
	.hint{
		margin-top: 40rpx;
		font-size: 23rpx;
		font-family: PingFang SC;
		
		color: #FF0844;
		line-height: 27rpx;
	}
	.save{
		/* margin-top: 130rpx; */
		margin:130rpx auto 0;
		width: 544rpx;
		height: 104rpx;
		background: #D1CFDD;
		box-shadow: 0rpx 3rpx 9rpx 0rpx rgba(0, 0, 0, 0.04);
		border-radius: 52rpx;
	}
	.save-text{
		margin: 37rpx 0rpx 0rpx 240rpx;
		font-size: 30rpx;
		font-family: PingFang SC;
		font-weight: bold;
		color: #FFFFFF;
		line-height: 27rpx;
		display:inline-block;
	}
</style>
